<template>
	<view class="page padding-lr">
		<view class="text-lg text-333 padding-tb text-bold">选择开店套餐</view>
		<view class="bg-white padding margin-bottom radius-16" :class="selectIndex==index?'bg-theme-opacity':''" v-for="(item, index) in list" :key="index" @click="handlePackage(item.id,index)">
			<view class="padding-bottom-sm  text-df flex justify-between align-center">
				<text class="text-theme text-bold">{{ item.name }}</text>
				<view class="text-price price text-bold">{{ item.money }}/年</view>
			</view>
			<!-- <view class="padding-tb radius solid-bottom text-df flex justify-between align-center">
				<view>套餐名称</view>
				<view >{{ item.description }}</view>
			</view> -->
			<view class="padding-tb-sm radius  text-333 flex justify-between align-center">
				<view class="text-bold">最大商品添加数量</view>
				<view class="text-bold">{{ item.goods_num }}个</view>
			</view>
			<view class="padding-tb-sm radius  text-333 flex justify-between align-center">
				<view class="text-bold">平台抽成比例</view>
				<view class="text-bold">{{ item.merchant_ratio+'%' }}</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			list: [],
			selectIndex:null,
		};
	},
	onLoad() {
		this.store_level();
		this.getInfo()
	},
	methods: {
		getInfo() {
			let store_joinin_id = uni.getStorageSync('store_joinin_id') || 0;
			this.$api
				.post('/v1/61039de5147b5',{},{
					header:{
						Storeid:store_joinin_id,
					}
				})
				.then(res => {
					if (res.data.code == 1) {
						this.selectIndex=res.data.data.store_level-1
					} else {
						this.$message.info(res.data.msg);
					}
				})
				.catch(err => {
					console.log(err);
				});
		},
		store_level() {
			this.$api
				.post('/v1/61036422502f6')
				.then(res => {
					if (res.data.code == 1) {
						this.list = res.data.data;
					} else {
						this.$message.info(res.data.msg);
					}
				})
				.catch(err => {
					console.log(err);
				});
		},
		handlePackage(id,index) {
			this.selectIndex=index
			let store_joinin_id = uni.getStorageSync('store_joinin_id') || 0;
			let store_user_id = uni.getStorageSync('store_user_id') || 0;
			this.$api
				.post('/v1/610362b22f364', { store_level: id },{
					header:{
						Storeid:store_joinin_id,
						Userid:store_user_id
					}
				})
				.then(res => {
					if (res.data.code == 1) {
						uni.navigateTo({
							url: `/pages/user/shop/shop-authentication/index?type=${index}`
						});
					} else {
						this.$message.info(res.data.msg);
					}
				})
				.catch(err => {
					console.log(err);
				});
		}
	}
};
</script>

<style lang="scss" scoped>
.price {
	padding: 10rpx 24rpx;
	color: #333333;
	background: #F8F8F8;;
	border-radius: 32rpx;
}
.radius-16{
	border-radius: 16rpx;
}
.bg-theme-opacity{
	background: rgba($theme, 0.15);
}
</style>
